body {background-color: #f5f5f5;}

header {background-color: #1e1647; height: 60px; overflow: hidden;}
header .logo {width: 95px; height: 60px; overflow: hidden;}
header .sub-nav > ul {background: none; margin-left: 80px}
header .sub-nav > ul > li > a {display: block; padding: 0 20px; height: 60px; line-height: 60px; color: #ffffff; font-size: 1.2em;}
header .sub-nav > ul > li > a:hover, header.auction .sub-nav > ul > li > a.active {color: #fcff02; background: none;}
header .search {float: right; margin: 10px; margin-right: 30px; background: #ffffff; width: 420px; height: 40px;}
header .search .search-input {width: 370px; outline: 0; background-color: transparent; color: #000000; height: 40px; line-height: 40px; text-indent: 10px;}
header .search .search-btn {width: 50px; text-align: center; color: #000000; height: 100%; line-height: 40px; border: 0; background-color: #dbdbdb;}

.sub-menu {position: relative; background-color: #1e1647; width: 210px; padding-bottom: 2px; height:365px;}
.sub-menu .sub-menu-top {display: block; width: 100%; height: 45px; line-height: 45px; color: #ffffff; font-size: 1.2em; font-weight: bold; padding-left: 50px; background: url(../images/arrow_down3.png) no-repeat right center;}
.sub-menu > ul {position: relative; z-index: 3;}
.sub-menu > ul > li > .title {display: block; width: 100%; height: 45px; line-height: 45px; color: #ffffff; font-size: 16px; padding-left: 50px;}
.sub-menu > ul > li:hover > .title{background-color: #ffffff; color: #1e1647;}
.sub-menu > ul > li > .sub-menu-list {display: none; position: absolute; top: 0; left: 210px; width: 260px; height: 368px; background-color: #ffffff;}
.sub-menu > ul > li > .sub-menu-list a {width: 50%; font-size: 14px; color: #333333; display: block; float: left; padding: 10px 20px;}
.sub-menu > ul > li > .sub-menu-list a:hover {background-color: #eeeeee;}
.sub-menu > ul > li:hover > .sub-menu-list {display: block;}

.sub-nav {position: relative;}
.sub-nav > ul{background-color: #e70012; overflow: auto;}
.sub-nav > ul > li {float: left;}
.sub-nav > ul > li > a {display: block; padding: 0 30px; height: 40px; line-height: 40px; color: #ffffff; font-size: 1.2em;}
.sub-nav > ul > li > a:hover {background-color: #ffffff; color: #e70012;}

.banner {margin: 0; position: relative; width: 930px; height: 362px; overflow: hidden;}
@-webkit-keyframes fadeIn {0% {opacity: 0.5;}100% {opacity: 1;}}
@-webkit-keyframes fadeOut {0% {opacity: 1;}100% {opacity: 0.5;}}
.banner .banner-img li {display: none; -webkit-animation-name: fadeOut; -webkit-animation-duration: 1s; -webkit-animation-iteration-count: 1; -webkit-animation-delay: 0s;}
.banner .banner-img li.active {display: block; -webkit-animation-name: fadeIn;}
.banner .banner-img li a img {width: 930px; height: 362px;}
.banner .banner-btn {position: absolute; bottom: 2px; text-align: center; width: 100%;}
.banner .banner-btn a {background-color: #333333; color: #ffffff; border-radius: 50%; width: 12px; height: 12px; display: inline-block; margin: 0 5px;}
.banner .banner-btn a:hover, .banner .banner-btn a.active {background-color: #87520c;}
.banner .banner-page {display: none;}
.banner .banner-page a {position: absolute; top: 50%; z-index: 4; margin-top: -31px; display: block; width: 28px; height: 62px; line-height: 62px; background: rgba(0,0,0,.2); color: #fff; text-align: center; font-size: 22px; font-weight: 400; font-family: simsun;}
.banner .banner-page a.prev {left: 0;}
.banner .banner-page a.next {right: 0;}

.main {margin-bottom: 10px;}
.main .list h4 {border-left: #c81622 3px solid; line-height: 25px; text-indent: 5px;}
.main .list .form-group {position: relative; height: 300px; width: 840px; overflow: hidden; background-color: #ffffff;}
.main .list .form-group > a {display: block; height: 300px; width: 600px;}
.main .list .form-group > a > img {width: 100%; height: 100%;}
.main .list .form-group .info {width: 215px; height: 300px; position: relative; margin: 0 10px;}
.main .list .form-group .info .bids .btn {display: block; width: 100%; color: #ffffff; border: 0; border-radius: 0; background: #1e1647; height: 40px; text-align: center; font-size: 1.2em; line-height: 40px; padding: 0;}
.main .list .form-group .info .title {margin-top: 5px; line-height: 30px; font-size: 1.2em; max-height: 180px; overflow: hidden; text-overflow: ellipsis; display: block;}
.main .list .form-group .info .desc {position: absolute; bottom: 0; left: 0; color: #6b6b6b; font-size: 1em; line-height: 25px;}
.main .list .form-group .info .desc p {margin: 10px 0 0 0;}
.main .list .form-group .info .desc p.price .red {font-size: 22px; font-weight: bold;}

.main .hot h5 {border-left: #c81622 3px solid; margin-top: 10px; text-indent: 5px;}
.main .hot .form-group {position: relative; width: 100%; overflow: hidden; background-color: #ffffff; padding: 10px;}
.main .hot .form-group > a {display: block; width: 100%; max-height: 260px; overflow: hidden;}
.main .hot .form-group > a > img {width: 100%; height: 100%;}
.main .hot .form-group .info .title {margin-top: 5px; line-height: 30px; max-height: 60px; overflow: hidden; text-overflow: ellipsis; display: block;}
.main .hot .form-group .info .desc {overflow: auto;} 
.main .hot .form-group .info .desc .bids {float: left;}
.main .hot .form-group .info .desc .bids .btn {display: block; width: 85px; height: 30px; font-size: 13px; line-height: 30px; color: #ffffff; border: 0; border-radius: 0; background: #1e1647; text-align: center; padding: 0;}
.main .hot .form-group .info .desc .time {float: right; height: 30px; line-height: 30px; font-size: 12px;}

em {font-style: normal;}
em.num {color: #a66223; margin-right: 4px;}
.product-info-panel dt {margin-right: 10px; font-weight: normal;}
.product-info-panel-desc dt span.red-addon {text-align: center; padding: 5px 10px; display: inline-block; background-color: #d33031; color: #ffffff; height: 50px; line-height: 20px; font-weight: normal;}
.product-info-panel-desc dd {border: 1px solid #f5f5f5;}
.product-info-panel-desc dd p {margin: 0; line-height: 25px; padding: 0 10px;}
.product-info-panel-desc dd span.time em {font-size: 1.2rem; margin: 0 4px;}
.product-info-panel-desc .join {margin-right: 20px;}
.product-info-panel-price {margin-top: 20px !important;} 
.product-info-panel-price .yen {font-weight: 700; font-size: 1.2rem; margin-right: 10px; color: #666666 !important;}
.product-info-panel-price .price {font-weight: 700; font-size: 2.5rem; color: #666666 !important;}
.product-info-panel-price .quantity {margin-left: 20px;}
.product-info-action {padding: 20px 0;}
.product-info-action .btn {background-color: #1e1647; color: #ffffff; font-weight: 500; width: 200px; border-radius: 0;}
.product-info-bid {margin-top: 20px;}
.product-info-bid span {margin-right: 30px; color: #9ea196;}
.product-info-action-bond {color: #d33031; font-weight: 500;}
.product-info-action-bond dt {float: left; margin-right: 10px; font-weight: 500; line-height: 30px;}
.product-info-action-bond dd {font-weight: 500; line-height: 30px;}
.product-info-action-bond .status {font-weight: 700; font-size: 1.2rem; margin-left: 10px; background-color: #d33031; color: #ffffff; padding: 5px 10px;}
.product-info-action-bond .status.in {background-color: #1e1647;}
.product-info-action .input {border: 1px solid #bbbbbb; float: left; height: 40px; line-height: 40px; outline: 0; padding: 0 10px; width: 100px;}
.product-info-action .bond {border: 0; color: #ffffff; width: 100px; height: 40px; line-height: 40px; font-size: 1.3rem;}

.tab-bar li a.selected {background-color: #1e1647;}

.bondlogs .hd {background-color: #f2f2f2; padding: 10px; margin-bottom: 10px;}
.bondlogs .bd li {padding: 10px;}
.bondlogs .hd span, .bondlogs .bd span {width: 200px; display: inline-block; text-align: center;}
.bondlogs .bd li.active {color: #d33031;}